<template>
  <ContentWrap>
    <el-descriptions :title="'风险点：'+riskAssessmentApplyRecord?.riskInfoName" :column="3" :labelStyle="{width: '150px'}">
      <el-descriptions-item label="风险类型:" >
        {{riskTypeDict[riskAssessmentApplyRecord?.riskType]}}
      </el-descriptions-item>
      <el-descriptions-item label="设备数量:" >
        {{ riskAssessmentApplyRecord?.riskTypeInstanceId }}
      </el-descriptions-item>
      <el-descriptions-item label="申请时间:" >
        {{ formatDate(riskAssessmentApplyRecord?.createTime)}}
      </el-descriptions-item>
    </el-descriptions>
    <el-collapse v-if="riskAssessmentApplyRecord?.details" v-model="activeNames">
      <el-collapse-item
        v-for="(group, idx) in riskAssessmentApplyRecord.details"
        :key="idx"
        :name="idx"
        :title="group[0]?.identifyObjectName || '风险对象'"
      >
        <el-card class="mb-12px">
          <el-table :data="group" style="width: 100%">
            <el-table-column label="辨识内容" prop="identifyContent" />
            <el-table-column label="编码" prop="identifyContentCode" />
            <el-table-column label="危害" prop="hazard" />
            <el-table-column label="工程解决方案" prop="projectSolution" />
            <el-table-column label="管理解决方案" prop="managerSolution" />
            <el-table-column label="个人解决方案" prop="selfSolution" />
            <el-table-column label="培训教育方案" prop="trainEduSolution" />
            <el-table-column label="应急解决方案" prop="badSolution" />
            <el-table-column label="操作" align="center">
              <template #default="{ row }">
                <el-button type="primary" size="small" @click="handleAssess(row)">评估</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-card>
      </el-collapse-item>
    </el-collapse>
  </ContentWrap>
</template>

<script setup lang="ts">/** 风险辨识 列表 */

import {RiskApplyRecordApi} from '@/api/zjyj/riskapplyrecord';
import {riskTypeDict} from '@/utils/dict';
import {formatDate} from '@/utils/formatTime';
import { ElMessage } from 'element-plus'

defineOptions({name: 'AssessmentApplyRecord'});
const props = defineProps<{
  applyRecordId: number
}>()
const riskAssessmentApplyRecord = ref()
const activeNames = ref([])

const getInfo = async () => {
  const data = await RiskApplyRecordApi.getRiskApplyRecord(props.applyRecordId)
  // details 根据identifyObjectId 进行聚合分组，如果identifyObjectId 相同，则将details 中的数据进行合并
  const details = data.details.reduce((acc, cur) => {
    if (!acc[cur.identifyObjectId]) {
      acc[cur.identifyObjectId] = []
    }
    acc[cur.identifyObjectId].push(cur)
    return acc
  }, {})
  data.details = Object.values(details)
  console.log(data.details)
  riskAssessmentApplyRecord.value = data
  // 默认展开所有折叠面板
  activeNames.value = data.details.map((_, idx) => idx)
}

const handleAssess = (row: any) => {
  ElMessage.info('评估功能开发中')
}

onMounted( async () => {
  await getInfo()
})

</script>
